import elTest from './elTest.vue'
import ElAvatar from './ElAvatar.vue'
import store from './store'
// 封装公用库的时候会用到插件，插件本质就是注册全局的一些方法，组件，指令....
const MyPlugin = {
  install: function(Vue, options) {
    // 1. 添加全局方法或 property
    // 挂载在Vue构造器上面
    Vue.fn = function() {
      console.log('我是一个全局的方法')
    }

    //     // 2. 添加全局资源
    Vue.directive('permission', {
      inserted(el, binding, vnode, oldVnode) {
        // console.log(el) // dom元素
        // console.log(binding) // 接收参数
        // const roles = ['viewer'] // 真实业务中应该store里面取
        console.log(binding)
        const roles = store?.state?.user?.userInfo?.roles?.points
        const permission = binding.value // 组件传进来的权限
        const hasPermission = permission.some(item => {
          if (roles?.includes(item)) {
            // 有权限
            return true
          }
        })

        if (!hasPermission) {
          // 没有权限
          el.parentNode && el.parentNode.removeChild(el) // 先找父节点然后删除自己 删除当前节点
        }
      },
      update() {
        // 和 inserted一样的逻辑
      }

    })

    // 4. 添加实例方法
    // 挂载在构造出来的实例上面
    Vue.prototype.$message1 = function(msg) {
      alert(msg || '我是一个提示消息')
    }
    Vue.component('elTest', elTest)
    Vue.component(ElAvatar.name, ElAvatar)
  }
}
export default MyPlugin
